.main {
	min-height: 100vh;
	background: @context-primary;
	overflow: hidden;
	.stack-content{
		padding:0 40rpx;
		.stack-search{
			position: relative;
			display: flex;
			align-items: center;
			justify-content: center;
			height: 64rpx;
			width: 100%;
			border-radius: 60rpx;
			background: #FFFFFF;
			box-shadow: 0rpx 22rpx 32rpx rgba(228, 192, 192, 0.22);
			margin: 18rpx 0;
			.indexiconn{
				position: absolute;
				left: 0;
				top: 0;
				display: flex;
				align-items: center;
				justify-content: center;
				width: 102rpx;
				height: 100%;
				image{
					width: 28rpx;
					height: 28rpx;
					
				}
			}
			#indexbtn {
				width: 418rpx;
				text-align: left;
				height: 100%;
				font-size: 28rpx;
				color: #91929F;
				min-height: 0 !important;
				overflow: hidden;
			}
		}

	}
	.banner{
		width: calc(100% - 40rpx);
		height: 208rpx;
		margin: 0 auto;
		image{
			width: 100%;
			height: 100%;
		}
	}
	.book-content{
		padding: 0 40rpx 0 40rpx;
		.list{
			display: flex;
			align-items: center;
			flex-wrap: wrap;
			color: #666;
			font-size: 24rpx;
			margin-bottom: 20rpx;
			.list-title{
				margin-right: 40rpx;
			}
			.list-item{
				margin-right: 10rpx;
				padding: 8rpx 18rpx;
				border-radius: 8rpx;
			}
			.item-active{
				color: @color-strong;
				background:@color-subtle;
			}
			.list-item:last-child{
				margin-right:0;
			}
		}
		.stack-title{
			display: flex;
			align-items: center;
			flex:1;
			margin: 28rpx 0;
			.stack-text{
				color: @color-normal;
				font-size: 20rpx;
				padding: 0 56rpx;
				white-space: nowrap;
			}
			.stack-border{
				width:100%;
				height:2rpx;
				background: @color-hover;
			}
		}
		.stack-list{
			height:calc(100vh - 675rpx);
			.scrollHeight{
				height: 100%;
				.stack-item{
					display: flex;
					align-items: center;
					flex:1;
					.stack-number{
						width:48rpx;
						color: @color-normal;
						font-size: 36rpx;
					}
					.stack-image{
						width: 136rpx;
						height: 188rpx;
						box-shadow: 4rpx 4rpx 8rpx 0px rgba(0,0,0,0.25);
						border-radius:12rpx;
						overflow: hidden;
						margin:0 28rpx;
					}
					.stack-box{
						width: calc(100% - 240rpx);
						.stack-title{
							font-weight: bold;
							font-size: 32rpx;
							color: #333333;
							overflow: hidden;
							text-overflow: ellipsis;
							display: -webkit-box;
							-webkit-box-orient: vertical;
							-webkit-line-clamp: 1;
						}
						.stack-intro{
							font-size: 24rpx;
							overflow: hidden;
							text-overflow: ellipsis;
							display: -webkit-box;
							-webkit-box-orient: vertical;
							-webkit-line-clamp: 3;
							color: #717171;
							line-height: 40rpx;
							margin-top:-10rpx;
						}
						.stack-tabs{
							display: flex;
							.tab {
								height: 34rpx;
								text-align: center;
								font-size: 24rpx;
								line-height: 28rpx;
								margin-right: 16rpx;
								color: #fff;
								padding: 0 14rpx;
								margin: 10rpx 0;
							}
							
							.tab:nth-child(odd) {
								color: @color-normal;
								background: @color-subtle;
							}
							
							.tab:nth-child(even) {
								background: #FFEEEE;
								color:#ED7E7F;
								
							}
						}
					}
				}
			}
		}
		
	}
}